<template>
  <div class="sm-sman-sortingManagement" style="with:100%;height:100%;">
    <!-- table隐藏三角 -->
    <div class="isTableShow" @click="tableSwitch"></div>
    <div class="smSmgTop">
      <TopSearch ref="topSm" style="height:60px">
        <slot>
          <el-steps :active="active" finish-status="success" align-center>
            <el-step title="执行任务" ></el-step>
            <el-step title="工作包扫码" ></el-step>
            <el-step title="缓存箱扫码" ></el-step>
            <el-step title="物料确认" ></el-step>
            <el-step title="分拣保存" ></el-step>
            <el-step title="缓存箱回库" ></el-step>
            <el-step title="工作包回库" ></el-step>
            <el-step title="查看缓存箱" ></el-step>
            <el-step title="暂停当前工作包任务" ></el-step>
            <!-- <el-step title="分拣保存" ></el-step> -->
          </el-steps>

          <el-drawer  title="缓存箱列表"  size="75%" :visible.sync="drawer.drawer" :with-header="false">
            <el-table :data="drawer.tableData" style="width: 100%" row-key="id" height=550 border  highlight-current-row  @current-change="currentTableData">
              <el-table-column  prop="workbinCode" label="缓存箱名字" width="150"> </el-table-column>
              <el-table-column prop="workbinStatus" label="状态" width="130"> </el-table-column>
              <el-table-column prop="taskType" label="需手动处理" width="130"> </el-table-column>
              <el-table-column prop="roadway" label="巷道" width="120"> </el-table-column>
              <el-table-column prop="taskCnt" label="当前巷道排队任务数" width="180"> </el-table-column>
              <el-table-column prop="waitMin" label="预计等待时长(分钟)" width="180"> </el-table-column>
              <el-table-column prop="itemCode" label="图号" width="150" show-overflow-tooltip></el-table-column>
              <el-table-column prop="itemQty" label="待入数量"></el-table-column>
              <el-table-column prop="aoCode" label="配套AO" width="180" show-overflow-tooltip></el-table-column>
              <el-table-column prop="mProductNumber" label="型号"></el-table-column>
              <el-table-column prop="createTime" label="创建时间" width="150" ></el-table-column>
              <el-table-column prop="orderTime" label="下发时间" width="150" ></el-table-column>
              <el-table-column prop="parentTaskId" label="移库中" width="150" ></el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <el-button  size="mini" v-if="scope.row.taskType=='可以创建任务'" @click="handleEdit(scope.$index, scope.row)">创建任务</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-drawer>
        </slot>
      </TopSearch>
    </div>
    <div class="bottomMainBox">
      <div class="left-mainbox">
        <div class="left-mainbox-one">
          <TableTitle>
            <slot>
              <p>
                数据预览
              </p>
            </slot>
          </TableTitle>
          <ShowDataNew></ShowDataNew>
        </div>
        <div class="left-mainbox-two">
          <TableTitle>
            <slot>
              <p>
                功能选择
              </p>
            </slot>
          </TableTitle>
          <ul style="height:88%;width:100%;text-align:center;overflow-x:hidden" class="funcBoxUl">
            <!-- <li>
              <el-button size="mini" type="primary" @click="hcxComeBtn">缓存箱出库</el-button>
            </li> -->
            <li>
              <el-button class="btn-width" size="mini" type="primary" @click="hcxScan">缓存箱扫码</el-button>
            </li>
            <!-- <li>
              <el-button size="mini" type="primary" @click="gzbComeBtn">工作包出库</el-button>
            </li> -->
            <li>
              <el-button class="btn-width" size="mini" type="primary" @click="gzbScan">工作包扫码</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="hcxBoxBackBtn">缓存箱回库</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="gzbBackBtn">工作包回库</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="baocun" v-loading.fullscreen.lock="fullscreenLoading">分拣保存</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="gzbInfoBtn">执行任务</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="lookupHcx">查看缓存箱</el-button>
            </li>
            <li>
              <el-button class="btn-width" size="mini" type="success" @click="showAddHcxView">补叫缓存箱</el-button>
            </li>
            <li><el-button class="btn-width" size="mini" type="success" @click="refresh">刷新</el-button></li>
            <li><el-button class="btn-width" size="mini" type="success" @click="packageStay">新任务暂停</el-button></li>
            <li><el-button class="btn-width" size="mini" type="success" @click="cleanWaitingTask">清理等待任务</el-button></li>
          </ul>
        </div>
      </div>
      <div class="right-mainbox">
        <div class="right-leftmainbox">
          <div class="gzbAllInfo">
            <TableTitle>
              <slot>
                <p>
                  工作包任务
                </p>
              </slot>
            </TableTitle>
            <AllGzbInfo ref="allGzbInfoChild"></AllGzbInfo>
          </div>
          <div class="gzbInfoBox">
            <TableTitle>
              <slot>
                <p>
                  AO
                </p>
              </slot>
            </TableTitle>
            <BGoodsInfo style="height:88%;overflow-x:hidden"></BGoodsInfo>
          </div>
          <div class="hcxInfoBox">
            <TableTitle>
              <slot>
                <p>
                  待分拣信息
                </p>
              </slot>
            </TableTitle>
            <XGoodsInfo v-on:receiveGzb='receiveGzb'></XGoodsInfo>
          </div>
        </div>
        <div class="right-rightmainbox">
          <div class="rrTopTable">
            <TableTitle>
              <slot>
                <p>
                  工作包分拣任务列表
                </p>
              </slot>
            </TableTitle>
            <TopTableNew></TopTableNew>
          </div>
          <div class="rrMidTable">
            <TableTitle>
              <slot>
                <p>
                  AO分拣任务列表
                </p>
              </slot>
            </TableTitle>
            <MidTableNew></MidTableNew>
          </div>
          <div class="rrLogTable">
            <TableTitle>
              <slot>
                <p>
                  AO物料详情
                </p>
              </slot>
            </TableTitle>
            <taskLogTable></taskLogTable>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import TopSearch from "../../../../components/TopSearch.vue";
import LastGoods from "./components/LastGoods.vue"
import TopLeftTable from './components/TopLeftTable.vue'
import MidTable from "./components/MidTable.vue"
import TableTitle from "../../../../components/TableTitle.vue";
import request from'@/utils/request.js'
// new
import ShowDataNew from "./components/TopDataNew.vue"
import TopTableNew from './components/TopTableNew.vue'
import MidTableNew from './components/MidTableNew.vue'
import taskLogTable from './components/taskLogTable.vue'
import BGoodsInfo from './components/BGoodsInfo.vue'
import XGoodsInfo from './components/XGoodsInfo.vue'
import AllGzbInfo from './components/AllGzbInfo.vue'
import { smSmanHcxScan,smSmanGzbScan,putToolPackage,smSmanCsHcxOut,smSmanCsHcxBack,workBoxSmOut,workBoxSmBack,smSmgTheGzbInfo,smSmgCallSortBox} from "@/utils/api.js"
export default {
  name: "SortingManagement",
  inject:['reload'],
  components: {
    TopSearch,
    LastGoods,
    TopLeftTable,
    MidTable,
    TableTitle,
    // new
    ShowDataNew,
    TopTableNew,
    MidTableNew,
    BGoodsInfo,
    XGoodsInfo,
    AllGzbInfo,
    taskLogTable
  },
  data(){
    return{
      indexTm:'',
      hcxTM:'',
      hcxBackTm:'',
      gzbTM:'',
      gzbBackTm:'',
      aoNumber:'',
      gzbListInfo:[],
      hcxBoxBack:'',
      hcxBoxCome:[],
      gzbCome:[],
      marterialResult:[],
      // 步骤条
      active: 0,
      // 判断table是否显示
      isTable:true,
      // 存储统查工作包的信息
      allToTheGzbInfo:[],
      // 缓存箱扫码aocode
      hcxScanAoCode:'',
      scanConfirm:false,//重复扫码保存
      scanHcxOper:false,//重复扫码缓存箱回库
      scanGzbOper:false,//重复扫码工作包回库
      fullscreenLoading: false,
      drawer:{
        drawer:false,
        tableData:[],
        currentData:{}
      }
    }
  },
  methods:{
    handleEdit(index, row) {
      request.post("/PointPackageSortRest/createGkLog",{ID:row.id}).then((res)=>{
      console.log("res1",res);
      if(res.data.retCode=='200'){
            this.$Alert({
            title: "成功",message: res.data.message,type: "success"
            })
        }else{
            this.$Alert({
            title: "失败",message: res.data.message,type: "error",
            })
        }
      })
    },
    // 统一扫码判断接口方法
    scanning(){
      if(this.indexTm.length == 12){
        this.scanHcxOper = false;
        this.scanGzbOper = false;
        let indexTmList = [...this.indexTm]
        if(indexTmList[0] == 1){
          console.log(this.gzbTM,"托盘编码");
         /* if(this.gzbTM.length != 12){
            this.$Alert({
              title: "失败",
              message: '请先扫托盘码！',
              type: "error",
            })
            return;
          }*/
          // 缓存箱扫码
          this.$options.methods.hcxScan.bind(this)();
        }else if(indexTmList[0] == 2){
          // 工作包扫码
          this.$options.methods.gzbScan.bind(this)()
        }else if(indexTmList[0] == 3){
          this.$options.methods.hcxScan.bind(this)();
        }
      }else if(this.indexTm.length == 5){
        // 缓存箱出库 工作包出库
        this.$options.methods.hcxComeBtn.bind(this)(this.indexTm)
        this.$options.methods.gzbComeBtn.bind(this)(this.indexTm)
      }else if(this.indexTm == 9002){
        // 缓存箱回库
        this.$options.methods.hcxBoxBackBtn.bind(this)()
      }else if(this.indexTm == 9004){
        // 工作包回库
        this.$options.methods.gzbBackBtn.bind(this)()
      }else if(this.indexTm == 9005){
        // 分拣保存
        if(this.gzbTM.length != 12){
            this.$Alert({
              title: "失败",
              message: '请确认是否扫托盘码！',
              type: "error",
            })
            return;
          }
        if(this.hcxTM.length != 12){
          this.$Alert({
            title: "失败",
            message: '请确认是否扫缓存箱码！',
            type: "error",
          })
          return;
        }
        this.$options.methods.baocun.bind(this)();
      }else{
        // 物料确认
        if(this.indexTm.includes('{')){
          var indexObj = JSON.parse(this.indexTm);
          for(let mn=0;mn<this.marterialResult.length;mn++){
            if(this.marterialResult[mn].isScanConfirm){ //yebo 添加校验，先判断当前物料是否已经扫码
              continue;
            }
            if(indexObj.hasOwnProperty("CPHGZ")){
              if(indexObj.CPHGZ == this.marterialResult[mn].barcode){//yebo 修改 mesCheckQualiticationId替换为 barcode
                this.marterialResult[mn].isScanConfirm = true;
                this.$bus.$emit('smSmanMaterialNumber',mn);
                this.$Alert({
                  title: "成功",message: this.indexTm.CPHGZ + '物料确认成功！',type: "success",
                })
                break;
              }
            }else{
              console.log("标准件:"+this.indexTm);
              if(this.marterialResult[mn].barcode == indexObj.CKCODE){
                this.marterialResult[mn].isScanConfirm = true;
                this.$bus.$emit('smSmanMaterialNumber',mn);
                this.$Alert({
                  title: "成功", message: indexObj.CKCODE+ '物料确认成功！', type: "success",
                })
              }
            }
          }
          
        }else{
          for(let mn=0;mn<this.marterialResult.length;mn++){
            if(this.marterialResult[mn].isScanConfirm){ //yebo 添加校验，先判断当前物料是否已经扫码
              continue;
            }
            if(this.indexTm == this.marterialResult[mn].barcode){
              //yebo 新增  
              if(this.active!=3){ //物料确认涉及多次扫码，所以此处不做处理
                this.$options.methods.next.bind(this)();
              }
              this.marterialResult[mn].isScanConfirm = true;
              this.$bus.$emit('smSmanMaterialNumber',mn);
              break;
            }
          }
          this.$Alert({
              title: "成功",
              message: this.indexTm + '物料确认成功！',
              type: "success",
            })
        }
      }
    },
    //yebo 新增 扫码添加工作包时，将扫码工作包数据回传到主界面
    receiveGzb(gzbInfo){
      this.gzbListInfo.push(gzbInfo);
    },
    currentTableData(val){
      console.log("val",val);
      this.drawer.currentData = val;
    },
    lookupHcx(){
      this.drawer.drawer = true;
      this.drawer.tableData = [];
      var that = this;
      request.post("/PointPackageSortRest/searchSortingTask",{}).then((res)=>{
        console.log("res1",res);
        that.drawer.tableData = res.data;
      })
    },
    //xiaojian 刷新
    refresh() {
      this.reload();
    },
    packageStay(){
      request.post("/msTaskPackage/packageStay",{}).then((res)=>{
        console.log("res1",res);
        if(res.data.retCode=='200'){
          this.$Alert({
          title: "成功",message: res.data.message,type: "success"
          })
        }else{
          this.$Alert({
          title: "失败",message: res.data.message,type: "error",
          })
        }
      })
    },
    cleanWaitingTask(){
      request.post("/msTaskPackage/cleanWaitingTask",{}).then((res)=>{
        console.log("res1",res);
        if(res.data.retCode=='200'){
          this.$Alert({
          title: "成功",message: res.data.message,type: "success"
          })
        }else{
          this.$Alert({
          title: "失败",message: res.data.message,type: "error",
          })
        }
      })
    },
    //任务继续执行
    taskGoOn() {
      request.post("/msTaskPackage/sortTaskGoOn").then((res)=>{
        console.log("res",res);
        if(res.data.retCode=='200'){
            this.$Alert({
            title: "成功",message: res.data.message,type: "success"
            })
        }else{
            this.$Alert({
            title: "失败",message: res.data.message,type: "error",
            })
        }
      });  
    },
    // 步骤条函数
    next() {
        if (this.active++ > 0){
        /*  setTimeout(()=>{
            this.active = 1
          },1000)*/
        }
        console.log(this.active)
      },
    // 缓存箱出库 -----更换对的接口就行 格式已经写好
    hcxComeBtn(tiaoma){
      smSmanCsHcxOut({
          // msTaskAoIds:this.hcxBoxCome
          aoBarcode:this.indexTm
        }).then((res)=>{
          console.log('缓存箱出库',res)
          if(res.data.retCode == 200){
            this.$Alert({
              title: "成功",
              message: '缓存箱出库命令已下发！',
              type: "success",
            });
            this.aoNumber = tiaoma
            // 出库成功聚焦条码框 并清空
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
          }else {
            this.$Alert({
              title: "失败",
              message: '无法下发缓存箱出库命令！',
              type: "error",
            });
          }
        })
    },
    // 缓存箱扫码
    hcxScan(){
      this.scanConfirm = false;
      smSmanHcxScan({
        workbinCode:this.indexTm,
        aoCode:this.hcxScanAoCode
      }).then((res)=>{
        console.log('缓存箱扫码',res)
        if(res.data.retCode == 200) {
          this.hcxTM = this.indexTm
          console.log('缓存箱编码',this.hcxTM)
          this.$Alert({
              title: "成功",
              message: res.data.message,
              type: "success",
            });
          // 进度条函数
          this.$options.methods.next.bind(this)()
          // 拿到数据传给底部框
          this.marterialResult = res.data.responseBody;
          this.gzbListInfo = [];
          this.$bus.$emit('smsmnSendHcxInfos',{res:res.data.responseBody,hcxtm:this.hcxTM})
          document.querySelector('.sm-sman-rightInfo').style.display = 'inline'
          // 缓存箱扫码成功清空条码框并聚焦
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
        }else {
          this.$Alert({
              title: "失败",
              message: res.data.message,
              type: "error",
            });
          if(res.data.responseBody.length>0){
            this.hcxTM = res.data.responseBody[0].workbinCode;
            console.log(this.hcxTM);
            this.marterialResult = res.data.responseBody
            this.$bus.$emit('smsmnSendHcxInfos',{res:res.data.responseBody,hcxtm:this.hcxTM});
            document.querySelector('.sm-sman-rightInfo').style.display = 'inline';
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
          }

            
        }
      })
    },
    // 缓存箱回库
    hcxBoxBackBtn(){
      this.hcxBackTm = this.hcxTM;
      //判断当前箱子是否能够回库
      if(this.scanHcxOper){
        this.$Alert({title: "失败", message: "请不要重复扫缓存箱回库",type: "error"});
        return ;
      }
      
      smSmanCsHcxBack({
          workbinCode:this.hcxBackTm
        }).then((res)=>{
          console.log('缓存箱回库',res)
          if(res.data.retCode == 200){
            // 进度条函数
            this.$options.methods.next.bind(this)()
            //缓存箱扫码传参hcxScanAoCode
              this.hcxScanAoCode = res.data.responseBody.nextAo
            // 缓存箱回库后 将nextAo 传给Bgoods 切换高亮
            this.$bus.$emit('sotmgHbakBnextao',res.data.responseBody)
            //yebo 新增提示工作包是否需要回库
            this.$bus.$emit('reladGzbTip',res.data);
            // 缓存箱回库后 将上一个hcx数据框清空
            this.$bus.$emit('sotmgHcxclear','清空');
            this.scanHcxOper = true;
            this.$Alert({
              title: "成功",
              message: res.data.message,
              type: "success"
            });
            document.querySelector('.sm-sman-rightInfo').style.display = 'none'
            this.hcxTM = ''
            // 回库成功清空条码框并聚焦
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
          }else {
            this.$Alert({
              title: "失败",
              message: res.data.message,
              type: "error"
            });
          }
        })
    },
    // 工作包出库  
    gzbComeBtn(tiaoma){
      workBoxSmOut({
        agv:'',
        // msTaskAoIds:this.gzbCome
        aoBarcode:this.indexTm
      }).then((res)=>{
        console.log('工作包出库',res)
        if(res.data.retCode == 200){
          this.aoNumber = tiaoma
          this.$Alert({
            title: "成功",
            message: '工作包出库命令已下发！',
            type: "success",
          });
          // 出库成功聚焦条码框 并清空
          this.$refs.topSm.makeTmNull()
          this.$refs.topSm.openScan()
        }else {
          this.$Alert({
            title: "失败",
            message: '无法下发工作包出库命令！',
            type: "error",
          });
        }
      })
    },
    // 工作包扫码
    gzbScan(){
      this.gzbTM = this.indexTm;
      this.$bus.$emit('smsmnSendGzbInfo',{gzbtm:this.gzbTM});
    },
    // 工作包回库
    gzbBackBtn(){
      if(this.scanGzbOper){
        this.$Alert({title: "失败", message: "请不要重复扫工作包回库",type: "error"});
        return ;
      }
      this.gzbBackTm = this.gzbTM
      workBoxSmBack({
          palletCode:this.gzbBackTm
        }).then((res)=>{
          console.log('工作包回库',res)
          if(res.data.retCode == 200){
            this.$Alert({
              title: "成功",
              message: '工作包回库命令已下发！',
              type: "success",
            });
            document.querySelector('.smgXgoodsGzbBox').style.display = 'none'
            this.gzbTM = '';
            this.scanGzbOper = true;
            // 进度条函数
            this.$options.methods.next.bind(this)()
            // 工作回库后 传值给Allgzbinfo 切换高亮
            this.$bus.$emit('sotmgGzbBackAllinfo',res.data)
            // 工作包回库后 更新AO列表 并高亮对应AO
            this.$bus.$emit('sotmgGzbBackBinfo',res.data)
            // 回库成功清空条码框并聚焦
            this.$refs.topSm.makeTmNull()
            this.$refs.topSm.openScan()
          }else {
            this.$Alert({
              title: "失败",
              message: '无法下发工作包回库命令！',
              type: "error",
            });
          }
        })
    },
    // 分拣保存
    baocun(){
      
      if(this.scanConfirm){
        
        this.$Alert({title: "失败",message: '已经扫码保存，请不要重复扫码保存',type: "error",});
        return;
      }
      this.fullscreenLoading = true;
      this.scanConfirm = true;
      var that = this;
      putToolPackage({
        toolCode:this.gzbTM,
        materialDTOs:this.gzbListInfo
      }).then((res)=>{
        console.log('保存',res)
        if(res.data.retCode == 200) {
          this.$Alert({
            title: "成功",
            message: '保存成功',
            type: "success",
          });
          this.active++;//进度条跳转到缓存箱回库
          // 进度条函数
          this.$options.methods.next.bind(this)()
          // 回库成功清空条码框并聚焦
          this.$refs.topSm.makeTmNull()
          this.$refs.topSm.openScan();
          //保存后清理数据
          this.$bus.$emit("sotmgHcxclear",{});
        }else {
          this.$Alert({
            title: "失败",
            message: '保存失败',
            type: "error",
          });
        }
        that.fullscreenLoading = false;
        //yebo 2023-07-25 9005重新加载工作包下面AO
        this.$refs.allGzbInfoChild.reloadPackageAo();
      })
    },
    // 执行任务
    gzbInfoBtn(){
      smSmgCallSortBox({

          }).then((res)=>{
            console.log('执行分拣',res)
            if(res.data.retCode == 200){
              // 进度条函数
              this.$options.methods.next.bind(this)()
              // 获取隐藏的框 
              let gzbBox = document.querySelector('.sm-sman-leftInfo')
              gzbBox.style.display = 'block'
              //缓存箱扫码传参hcxScanAoCode
              this.hcxScanAoCode = res.data.responseBody.firstAo
              // 将内容传给Bgoodsinfo展示  给allgoods高亮 
              this.$bus.$emit('smgAtlloTheGzb',res.data.responseBody)
              // 成功后聚焦扫码
              this.$refs.topSm.makeTmNull()
              this.$refs.topSm.openScan()
              this.$Alert({
                title: "成功",
                message: res.data.message,
                type: "success",
              });
            }else{
              this.$Alert({
                title: "失败",
                message: res.data.message,
                type: "error",
              });
            }
          })
    },
    // Table开关
    tableSwitch(){
      
      let box = document.querySelector('.isTableShow')
      let infoBox = document.querySelector('.right-leftmainbox')
      let tableBox = document.querySelector('.right-rightmainbox')
      if(this.isTable == false){
        box.style.clipPath = 'polygon(0 50%,100% 100%,100% 0)'
        box.style.right = 7+'px'
        infoBox.style.width = 100 + '%'
        tableBox.style.display = 'none'

        // this.asideWidth = '0px'
        // box.style.left = '0px'
        this.isTable = true
      }else if(this.isTable == true){
        box.style.clipPath = 'polygon(0 0,0 100%,100% 50%)'
        box.style.right = -3+'px'
        infoBox.style.width = 55 + '%'
        tableBox.style.display = 'block'
        this.isTable = false
      }
    },
    showAddHcxView(){
      this.$bus.$emit("clickAddHcxViewBtn",{});
    }
  },
  mounted(){
    // 接收Xgoods 物料确认传来的已经确认物料个数
    this.$bus.$emit('somgXgoodsCmn',(e)=>{
      console.log(this.marterialResult)
      if(this.marterialResult.length == e){
        // 进度条函数
        this.$options.methods.next.bind(this)()
      }
    })
    // 测试接口 默认第一个为高亮为参数 调接口
    this.$bus.$on('smgAllThegzbInfo',(e)=>{
      this.allToTheGzbInfo = e
    })

    this.$bus.$on('saoma',(e)=>{
      this.indexTm = e
    })
    // this.$bus.$emit('scanBarcode',(e)=>{
    //   console("扫码条码",e);
    //   this.$options.methods.scanning.bind(this)(e);
    // })
    this.$bus.$on('scanBarcode',(e)=>{
      for(let i =0;i<e.length;i++){
        if(this.marterialResult[i].isScanConfirm != true){
          this.marterialResult[i].isScanConfirm = true;
          this.$bus.$emit('smSmanMaterialNumber',i);
        }
      }
    })
    this.$bus.$on('gzbListInfoss',(e)=>{
      // 回库成功清空条码框并聚焦
      this.$refs.topSm.makeTmNull()
      this.$refs.topSm.openScan()
    })
    // 接收首页 gzb出库 hcx入库 
    this.$bus.$on('smSmanGzbInfo',(e)=>{
      // this.gzbBack = e
      // 批量工作包出库
      this.gzbCome = []
      this.hcxBoxCome = []
      for(let p=0;p<e.length;p++) {
        this.gzbCome.push(e[p].msTaskAoId)
        this.hcxBoxCome.push(e[p].msTaskAoId)
      }
      // console.log(this.gzbCome)
    })
    this.$bus.$on('smSmanListSave',(e)=>{
      //yebo 调整前端逻辑，不能直接  this.gzbListInfo=e;这样扫码物料没用任何意义，不管扫码与否，都直接将缓存箱所有物料
      for(var i=0;i<this.gzbListInfo.length;i++){
        if(this.gzbListInfo[i].barcode==e.barcode){
          return ;
        }
        console.log("gzbListInfo放入值",e);
        this.gzbListInfo.push(e);
      }
      
    });

    
  }

};
</script>
<style scoped>
.sm-sman-sortingManagement {
  position: relative;
}
.el-button--success {
  background: #29bacd;
  border-color: #29bacd;
}
.el-button--success:hover {
  background: #23abbd;
  border-color: #23abbd;
}
.tbox {
  width: 100%;
  overflow: hidden;
  /* background: #29bacd; */
}
.tbox-left {
  float: left;
  width: calc(50% - 2px);
  margin-right: 2px;
  overflow: hidden;
}
.tbox-right {
  float: right;
  width: calc(50% - 2px);
  margin-left: 2px;
  overflow: hidden;
}
.bottomMainBox {
  width: 100%;
  height: calc(100% - 60px);
}
.left-mainbox {
  width: 230px;
  height: calc(100% - 4px);
  float: left;
}
.left-mainbox-one {
  height: 50%;
  border:1px solid rgb(140, 203, 255)
}
.left-mainbox-two {
  height: 50%;
  border:1px solid rgb(140, 203, 255)
}
.right-mainbox {
  float: left;
  width: calc(100% - 240px);
  height: 100%;
  /* background: #29bacd; */
  margin-left: 3px;
}
.gzbAllInfo {
  width: 100%;
  /* height: 120px; */
  padding-bottom: 5px;
  /* float: left; */
  /* background: red; */
}
.right-leftmainbox {
  width: 100%;
  height: 100%;
  /* background: red; */
  float: left;
}
.right-rightmainbox {
  width: 44%;
  height: 100%;
  float: left;
  margin-left: 1%;
  display: none;
}
.rrTopTable {
  height: 248px;
}
.isTableShow {
  width: 10px;
  height: 20px;
  background: #2BBFCF;
  /* clip-path: polygon(0 0,0 100%,100% 50%); */
  clip-path: polygon(0 50%,100% 100%,100% 0);
  position: absolute;
  /* right: -3px; */
  right: 7px;
  top: 180px;
  cursor: pointer;
  z-index: 99;
  /* transition-duration: 0.2s; */
}
.gzbInfoBox {
  /* width: 300px; */
  height: calc(50% - 60px);
  /* overflow: hidden; */
  /* background: red; */
  /* 让信息框内信息往右叠加 出现滚动条 */
  /* overflow-x: hidden; */
  /* overflow-y: scroll; */
}
.hcxInfoBox {
  height: calc(50% - 60px);
}
.mainMidBox {
  width: 100%;
}
.smSmgTop {
  margin: 0 auto;
}
.funcBoxUl li {
  width: 50%;
  float: left;
  margin-top: 5px;
}
.btn-width{
  width:90px;
}
</style>